@import "../styles/var.scss";
@import "../styles/common.scss";
.message {
  @include self-center();
  z-index: 999;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1);
  border: 1px solid #ebeef5;
  border-radius: 8px;
  padding: 14px 26px 14px 13px;
  width: 330px;
  display: flex;
  align-items: center;
  transition: 0.3s;
  transform: translate(-50%, -50%) translateY(20px);
  opacity: 0;
  .icon {
    font-size: 20px;
    margin-right: 4px;
  }
  &-info {
    background-color: rgba($primary, 0.3);
    border: 1px solid $primary;
    color: $primary;
  }
  &-success {
    background-color: rgba($success, 0.3);
    border: 1px solid $success;
    color: $success;
  }
  &-error {
    background-color: rgba($danger, 0.3);
    border: 1px solid $danger;
    color: $danger;
  }
  &-warn {
    background-color: rgba($warn, 0.3);
    border: 1px solid $warn;
    color: $warn;
  }
}

